/**
 * @class Spark.Button
 * @extends Spark.Component
 * <p>按钮组件.
 * @author njq.niu@hand-china.com
 * @constructor
 * @param {Object} config 配置对象. 
 */
$S.Button = Ext.extend($S.ViewComponent,{
    disableCss:'s-btn-disabled',
    overCss:'s-btn-over',
    pressCss:'s-btn-pressed',
    disabled:false,
    constructor: function(config) {
        $S.Button.superclass.constructor.call(this, config);
    },
    initComponent : function(config){
        $S.Button.superclass.initComponent.call(this, config);
        this.text = this.wrap.child('span[stype=text]');
        if(this.hidden == true)this.setVisible(false)
        if(this.disabled == true)this.disable();
    },
    processListener: function(ou){
        $S.Button.superclass.processListener.call(this,ou);
        this.wrap[ou]("click", this.onClick,  this);
        this.wrap[ou]("focus",this.onFocus,this);
        this.wrap[ou]("blur",this.onBlur,this);
        this.wrap[ou]("mousedown", this.onMouseDown,  this);
    },
    initEvents : function(){
        $S.Button.superclass.initEvents.call(this);
        this.addEvents(
        /**
         * @event click
         * 鼠标点击事件.
         * @param {Spark.Button} button 按钮对象.
         * @param {EventObject} e 键盘事件对象.
         */
        'click');
    },
    /**
     * 获取焦点
     */
    focus: function(){
        if(this.disabled)return;
        this.wrap.dom.focus();
    },
    /**
     * 失去焦点
     */ 
    blur : function(){
        if(this.disabled) return;
        this.wrap.dom.blur();
    },
    /**
     * 设置不可用状态
     */
    disable: function(){
        this.disabled = true;
        this.wrap.removeClass([this.pressCss])
        this.wrap.addClass(this.disableCss);
        this.wrap.dom.disabled = true;
    },
    /**
     * 设置可用状态
     */
    enable: function(){
        this.disabled = false;
        this.wrap.removeClass(this.disableCss);
        this.wrap.dom.disabled = false;
    },
    setEnabled : function(d){
        if(d===true) this.enable()
        else this.disable()
    },
    /**
     * 设置按钮文字
     */
    setText: function(t){
        if(t)this.text.update(t)
    },
    onMouseDown: function(e){
        e.preventDefault();
        this.focus();
        if(!this.disabled){
            this.wrap.addClass(this.pressCss);
            Ext.get(document.documentElement).on("mouseup", this.onMouseUp, this);
        }
    },
    onMouseUp: function(e){
        if(!this.disabled){
            Ext.get(document.documentElement).un("mouseup", this.onMouseUp, this);
            this.wrap.removeClass(this.pressCss);
        }
    },
    onFocusKeyDown : function(e){
        var key = e.getKey();
        if(key == 13 || key == 32){
            e.stopEvent();
            this.onClick(e);
        }else if(key ==27){
            this.onBlur(e)
        }
    },
    onClick: function(e){
        if(!this.disabled){
            this.fireEvent("click", this, e);
        }
    },
    onFocus : function(e){
        this.isFocused = true;
        this.onMouseOver(e);
    },
    onBlur : function(e){
        this.isFocused = false;
        this.onMouseOut(e)
    },
    onMouseOver: function(e){
        $S.Button.superclass.onMouseOver.call(this,e);
        if(!this.disabled)
            this.wrap.addClass(this.overCss);
       
    },
    onMouseOut: function(e){
        $S.Button.superclass.onMouseOut.call(this,e);
        if(!this.disabled)
            this.wrap.removeClass(this.overCss);
    }
});
$S.Button.getTemplate = function(id,text,width,css){
    width = width||70;
    return '<div style="width:'+width+'px; height: 25px; line-height: 25px;" id="'+id+'" class="s-btn '+(css||'')+'"><span class="e" unselectable="on">&nbsp;</span><span id="ext-gen40" unselectable="on">'+text+'</span></div><script>new Spark.Button({"id":"'+id+'"});</script>';
}